<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <base href="<%=basePath%>">

    <title>运动员</title>

    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->

    <link href="https://cdn.bootcss.com/material-design-icons/3.0.1/iconfont/material-icons.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="/css/ui.css" type="text/css"/>
    <link rel="stylesheet" href="/css/index.css" type="text/css"/>
    <script type="text/javascript" src="/js/jquery.min.3.3.1.js"></script>
</head>
<!--<link rel="stylesheet" href="/zTree/css/demo.css" type="text/css"></link>-->
<!--<link rel="stylesheet" href="/zTree/css/zTreeStyle/zTreeStyle.css" type="text/css"></link>-->
<!--<script type="text/javascript" src="/zTree/js/jquery-1.4.4.min.js"></script>-->
<script type="text/javascript" src="/zTree/js/jquery.ztree.core.js"></script></head>
<script type="text/javascript">

    var setting = {
        callback: {
            beforeClick: function(treeId, treeNode) {
                var zTree = $.fn.zTree.getZTreeObj("tree");
                if (treeNode.isParent) {
                    zTree.expandNode(treeNode);
                    return false;
                } else {
                    demoIframe.attr("src",treeNode.file + ".html");
                    return true;
                }
            }
        }
    };

    var setting = {
        view: {
            dblClickExpand: false,
            showLine: true,
            selectedMulti: false
        },
        data: {
            simpleData: {
                enable:true,
                idKey: "id",
                pIdKey: "pId",
                rootPId: ""
            }
        },
    };
    $(function(){
        $.post(
            "menulist",
            function(obj){
                $.fn.zTree.init($("#left") , setting , obj);
                var zTree = $.fn.zTree.getZTreeObj("left");
                zTree.expandAll(true);
            },
            "json"
        );
    });
</script>
<body>
<div class="row main">
    <div class="left">

        <nav class="navbar navbar-dark">
            <div class="navbar-brand">
                手球<span class="title-text">运动员管理系统</span>
            </div>
        </nav>
        <nav class="menu"  id="left">
            <div class="menu-item" title="系统管理">
                <i class="material-icons menu-icon">settings</i>
                <span class="menu-text">系统管理</span>
                <span class="menu-arrow"></span>
            </div>
<!--            <div class="menu-item" title="系统管理">-->
<!--                <i class="material-icons menu-icon">settings</i>-->
<!--                <span class="menu-text">系统管理</span>-->
<!--                <span class="menu-arrow"></span>-->
<!--            </div>-->
<!--            <div class="menu-item" title="管理">-->
<!--                <i class="material-icons menu-icon">settings</i>-->
<!--                <span class="menu-text"> </span>-->
<!--                <span class="menu-arrow"></span>-->
<!--            </div>-->

        </nav>



    </div>
    <div class="right col">
        <nav class="navbar navbar-light">
            <button class="navbar-toggler">
                <i class="material-icons">
                    menu
                </i>
            </button>
            <span class="navbar-text"> <i class="circle"></i> <span th:text="${userInfo.username}"></span> </span>
        </nav>
        <div class="content">
<!--            <iframe src="/welcome" style="height: 99%; width: 100%; border: 0;"></iframe>-->
            <iframe src="/welcome" name="right" id="right"  width="1665px" height="1030px"></iframe>
        </div>
    </div>
</div>
<script type="text/javascript" src="/js/index.js"></script>
</body>
</html>